import {View, Button, Text, Image, ScrollView, Radio} from '@tarojs/components';
import Taro from '@tarojs/taro';
import React, {Component} from 'react';
import * as T from '../types';
import './rechargeCard.less';
import actions from '../actions/index';
import {connect} from 'react-redux';
import {store2Props} from '../selectors';
import iplandMoney from '../image/ipland_money.png';
import api from 'api';
type ITopProps = T.IProps & T.ITopProps;
//@ts-ignore
@connect<Partial<ITopProps>, T.ITopState>(store2Props, actions)
export default class Info extends Component<Partial<ITopProps>, T.ITopState> {
  constructor(props: ITopProps) {
    super(props);
    this.state = {};
  }

  render() {
    let {
      main: {list, selectId, memberBase},
      actions: {action},
    } = this.props;
    return (
      <>
        <View className="rechargeCardList">
          {list.map((e) => (
            <View
              className={`rechargeCard rechargeCard-${selectId == e.id ? 'select' : ''}`}
              key={e.id}
              onClick={() => {
                action.commonChange('main.selectId', e.id);
              }}
            >
              <View className="cardTop">
                <Image className="moneyIcon" src={iplandMoney}></Image>
                {`${e.coinCount}`.split('').map((e) => (
                  <Text className="getUserMoney">{e}</Text>
                ))}
              </View>
              <View className="cardBottom">
                <Text className="bottomText1">
                  <Text className="moneyText">￥</Text>
                  {e.discountFlag == 1 ? e.discountPrice : e.price}
                </Text>
                {e.discountFlag == 1 && (
                  <Text className="bottomText2">
                    <Text className="moneyText2">￥</Text>
                    {e.price}
                  </Text>
                )}
              </View>
            </View>
          ))}
        </View>
        <View
          className="rechargeSubmit"
          onClick={() => {
            console.log(memberBase);
            if (!memberBase || !(memberBase.isAquamarineMember || memberBase.isCrystalMember)) {
              Taro.showToast({
                title: '请先成为会员',
              });
              return;
            }
            Taro.login({
              async success(res: {code: any | PromiseLike<string>; errMsg: string}) {
                if (res.code) {
                  let openid;
                  try {
                    openid = await api.payController.getLittleProgramOpenId(res.code);
                  } catch (e) {
                    Taro.showToast({
                      title: '系统异常,请稍后再试',
                      icon: 'none',
                      duration: 2000,
                    });
                    return;
                  }
                  await action.goToWeixinPay(openid);
                } else {
                  console.log('PayList_获取code失败！' + res.errMsg);
                }
              },
            });
          }}
        >
          立即充值
        </View>
      </>
    );
  }
}
